Page({
  data: {
    showAddDialog: false,
    relationTypes: ['配偶', '父母', '子女', '兄弟姐妹', '其他'],
    relationIndex: 0,
    name: '',
    phone: '',
    familyMembers: [
      {
        id: 1,
        name: '张三',
        avatar: '/images/avatar.jpg',
        role: '管理员',
        isSelf: true
      },
      {
        id: 2,
        name: '李四',
        avatar: '/images/avatar1.jpg',
        role: '成员',
        isSelf: false
      },
      {
        id: 3,
        name: '王五',
        avatar: '/images/avatar2.jpg',
        role: '成员',
        isSelf: false
      }
    ]
  },
  onLoad: function(options) {
    // 加载家庭数据
    this.loadFamilyData();
  },
  // 加载家庭数据
  loadFamilyData: function() {
    // 模拟网络请求
    wx.showLoading({
      title: '加载中...',
    });

    setTimeout(() => {
      wx.hideLoading();
    }, 1000);
  },
  // 显示添加家庭成员弹窗
  showAddFamilyDialog: function() {
    this.setData({
      showAddDialog: true,
      name: '',
      phone: '',
      relationIndex: 0
    });
  },
  // 隐藏添加家庭成员弹窗
  hideAddFamilyDialog: function() {
    this.setData({
      showAddDialog: false
    });
  },
  // 绑定姓名输入
  bindNameInput: function(e) {
    this.setData({
      name: e.detail.value
    });
  },
  // 绑定关系选择
  bindRelationChange: function(e) {
    this.setData({
      relationIndex: e.detail.value
    });
  },
  // 绑定手机号码输入
  bindPhoneInput: function(e) {
    this.setData({
      phone: e.detail.value
    });
  },
  // 添加家庭成员
  addFamilyMember: function() {
    const { name, phone } = this.data;

    if (!name) {
      wx.showToast({
        title: '请输入姓名',
        icon: 'none'
      });
      return;
    }

    if (!phone || phone.length !== 11) {
      wx.showToast({
        title: '请输入有效的手机号码',
        icon: 'none'
      });
      return;
    }

    // 模拟添加家庭成员
    wx.showLoading({
      title: '添加中...',
    });

    setTimeout(() => {
      // 添加新成员到列表
      const newMember = {
        id: Date.now(),
        name: name,
        avatar: '/images/avatar-default.png',
        role: '成员',
        isSelf: false
      };

      const familyMembers = [...this.data.familyMembers, newMember];

      this.setData({
        familyMembers: familyMembers,
        showAddDialog: false
      });

      wx.hideLoading();
      wx.showToast({
        title: '添加成功',
        icon: 'success'
      });
    }, 1000);
  }
})